<meta charset="UTF-8">
  <div class="content-wrapper" style='height: 100%;'>
    <section class="content-header">
      <h1 style="text-align:center;margin: -5px 0px 5px 0px;">
        	菜品设置
      </h1>
    </section>
    <div style='background: transparent;width: 100%;height: 90%;position: relative;'>
    	
    		<div style='position: absolute;width: 20%;height: 100%;border-top: 1px solid #ccc;border-left: 1px solid #ccc;border-bottom: 1px solid #ccc;left: 1%;overflow: auto;'>
    				<div style='width: 100%;height: 50px;border-bottom: 1px solid #ccc;font-size: 16px;'>
    						<span style='margin: 12px 0px 0px 2%;display: inline-block;width: 58px;cursor: pointer;font-size: 14px;' ng-click='allCategory()'>全部类别</span>
    						<!--<span style='margin: 12px 0px 0px 10px;display: inline-block;width: 14%;color: green;cursor: pointer;'>新增</span>
    						<span style='margin: 12px 0px 0px 10px;display: inline-block;width: 14%;color: blue;cursor: pointer;'>修改</span>
    						<span style='margin: 12px 0px 0px 10px;display: inline-block;width: 14%;color: red;cursor: pointer;'>删除</span>-->
    						<!--<button style='margin: 12px 1%;padding: 2px 6px;background-color: #f05050;font-size: 12px;width:20%;max-width: 40px;' class="btn pull-right" ng-click='delCategory()'>删除</button>
								<button style='margin: 12px 1%;padding: 2px 6px;background-color: #3c8dbc;font-size: 12px;width:20%;max-width: 40px;' class="btn pull-right" ng-click='updateCategory()'>修改</button>
								<button style='margin: 12px 1%;padding: 2px 6px;background-color: #3c8dbc;font-size: 12px;width:20%;max-width: 40px;' class="btn pull-right" ng-click='addCategory()'>新增</button>-->
    						<button class="btn btn-success" style='height: 30px;line-height: 30px;padding: 0px 5px;margin-right: 3px;' ng-click='addCategory()'>新增</button>
    						<button class="btn btn-info" style='height: 30px;line-height: 30px;padding: 0px 5px;margin-right: 3px;' ng-click='updateCategory()'>修改</button>
    						<button class="btn btn-danger" style='height: 30px;line-height: 30px;padding: 0px 5px;margin-right: 3px;' ng-click='delCategory()'>删除</button>
    				</div>
    				<div id='category_{{c.id}}' class='categories' ng-class="{even:!$even, odd:!$odd}"  ng-repeat='c in classify' ng-click='choiceCategory($event,c.id,c.name)'
    					style='position: relative;height: 40px;width: 100%;padding: 0px 0px 0px 14px;font-size: 18px;cursor: pointer;line-height: 40px;'>{{c.name}}</div>
    		</div>
    		<div style='position: absolute;width: 78%;height: 100%;border: 1px solid #ccc;right: 1%;'>
    					<div style='width: 100%;height: 50px;border-bottom: 1px solid #ccc;'>
    							<div class="form-group col-lg-2 col-xs-6 space" style='display: inline-block;width: 180px;vertical-align: middle;margin: 10px 0px 10px 15px;'>
											<input class="form-control" type="text" placeholder="请输入菜品名称 " ng-model="cardInfor" >
										</div>
										<button style='margin: 10px 1%;padding: 4px 12px;' class="btn pull-right" ng-click="download('dishTable','菜品设置信息_',categoryName)"><i class="fa fa-cloud-download"></i>&nbsp;&nbsp;导出</button>
										<!--<button style='margin: 12px 1%;padding: 4px 12px;background-color: #f05050;' class="btn pull-right" ng-click='delDish()'>删除</button>-->
										<!--<button style='margin: 12px 1%;padding: 4px 12px;background-color: #3c8dbc;' class="btn pull-right" ng-click='startEnd()'>启用/停用</button>-->
										<!--<button style='margin: 12px 1%;padding: 4px 12px;background-color: #3c8dbc;' class="btn pull-right" ng-click='updateDish()'>修改</button>
										<button style='margin: 12px 1%;padding: 4px 12px;background-color: #3c8dbc;' class="btn pull-right" ng-click="addDish()">新增</button>-->
    							<button class="btn btn-warning" style='height: 30px;line-height: 30px;padding: 0px 10px;margin-right: 5px;float: right;margin-top: 10px;' ng-click='startEnd()'>启用/停用</button>
    							<button class="btn btn-danger" style='height: 30px;line-height: 30px;padding: 0px 10px;margin-right: 5px;float: right;margin-top: 10px;' ng-click='delDish()'>删除</button>
    							<button class="btn btn-info" style='height: 30px;line-height: 30px;padding: 0px 10px;margin-right: 5px;float: right;margin-top: 10px;' ng-click='updateDish()'>修改</button>
    							<button class="btn btn-success" style='height: 30px;line-height: 30px;padding: 0px 10px;margin-right: 5px;float: right;margin-top: 10px;' ng-click="addDish()">新增</button>
    					</div>
    					<div style='width: 100%;height: calc(100% - 55px);overflow: auto;'>
    							<div  class="dataTables_wrapper form-inline dt-bootstrap " style='height: 100%;width: 98%;'>
					              	<div class="row">
						              	<div class="col-sm-12" style='padding: 0px;'>
							              	<table id='dishTable' style='width: 100%; position: relative;height:90%; display: block;' id="example1" class="table table-bordered table-striped dataTable" role="grid" aria-describedby="example1_info">
								                <thead style='display: inline-table;width: 100%;background: #ffffff;'>
									                <tr role="row">
									                	<th    style="width: 12%;">菜品名称</th>
									                	<th  style="width: 8%;">单位</th>
									                	<!--<th  style="width: 12%;">内部价格</th>-->
									                	<th   style="width: 8%;">外部价格</th>
									                	<th   style="width: 9%;">所属分类</th>
									                	<th   style="width: 15%;">售卖窗口</th>
									                	<th   style="width: 9%;">厨师</th>
									                	<th   style="width: 9%;">状态</th>
									                </tr>
								                </thead>
								              <tbody id='dataList' style='display: inline-table;width: 100%;'>
										                <tr ng-hide='dish.is_package' ng-click="itemSelected($event,dish.id)" style='position: relative;width: 100%;display: inline-table;' ng-class="{even:!$even, odd:!$odd}" ng-repeat="dish in dishesInfors track by $index">
											                  <td style="width: 12%;display: none;">{{dish.id}}</td><!--菜品id-->
											                  <td style="width: 12%;padding-left: 25px;text-align: left;">{{dish.name}}</td>
											                  <td style="width: 8%;padding-left: 25px;text-align: left;" >{{dish.unit_name}}</td>
											                  <!--<td style="width: 12%;">{{dish.in_price}}</td>-->
											                  <td style="width: 8%;">{{dish.price}}</td>
															  				<td style="width: 9%;padding-left: 25px;text-align: left;" >{{dish.category_name}}</td>
														  					<td style="width: 15%;padding-left: 25px;text-align: left;" >{{dish.window_name}}</td>
													  						<td style="width: 9%;padding-left: 25px;text-align: left;" >{{dish.chief_name}}</td>
									  										<td style="width: 8%;" >{{dish.status==1?'启用':'停用'}}</td>
										                </tr>
								                </tbody>
							                <tfoot>
							                </tfoot>
						             	  </table>
					              	</div>
				              	</div> 
				            	</div>
    					</div>
					              
    		</div>
    </div> 
</div>
<!-- 删除菜品 -->
  	<div class="modal fade" id="delDish" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">提示</h4>
      </div>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	确定要删除<span ng-bind="name"></span>吗？
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-success btn-lg" ng-click="del_dish(id);">确定</button>
      </div>
    </div>
  </div>
</div>
<!-- 删除类别 -->
  	<div class="modal fade" id="delCategory" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">提示</h4>
      </div>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	确定要删除<span ng-bind="categoryName"></span>吗？
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-success btn-lg" ng-click="del_category(categoryId);">确定</button>
      </div>
    </div>
  </div>
</div>
<!-- 模态框 新增类别 -->
<div class="modal fade" id="addCategory" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">新增菜品类别</h4>
      </div>
      <from>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	  <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">类别名称</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" ng-model="categoryName" ng-blur="judgeShow()" >
                            <span style="color: red;" ng-show="showIt"><i class="fa fa-close"></i>类别名称不能为空</span>
                             <!--<input type="text" class="form-control" placeholder="类别名称" ng-model="categoryName" ng-required="true">-->
                        </div>
                    </div>
         </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="submit" class="btn btn-success btn-lg" ng-click="addCategory_true();">确定</button>
      </div>
      </from>
    </div>
  </div>
</div>
<!-- 模态框 修改类别 -->
<div class="modal fade" id="updateCategory" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">修改菜品类别</h4>
      </div>
      <from>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	  <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">类别名称</label>
                        <div class="col-sm-10">
                        		<input type="hidden" class="form-control" ng-model="categoryId" >
                            <input type="text" class="form-control" ng-model="categoryName" >
                            <span style="color: red;" ng-show="categoryName==''"><i class="fa fa-close"></i>类别名称不能为空</span>
                             <!--<input type="text" class="form-control" placeholder="类别名称" ng-model="categoryName" ng-required="true">-->
                        </div>
                    </div>
         </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="submit" class="btn btn-success btn-lg" ng-click="updateCategory_true();">确定</button>
      </div>
      </from>
    </div>
  </div>
</div>

<style>
	.space{
		padding-left:2px;
		padding-right:2px;
	}
	.box{
		border-top:1px solid #d2d6de;
	}
	.pagination{
		margin:0;
	}
	.odd{background-color: #f9f9f9 ;}
	.even{background-color: #ffffff ;}
	.btn{    padding: 10px 12px;}
</style>
<script>
					$(document).ready(function() {
							
//							$('#table_example').hide();
  							//$('#example').dataTable();
					} );
					
				
	
</script>